package com.example.treehole.ui.page.myself

import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.automirrored.filled.ArrowForward
import androidx.compose.material3.Button
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.Icon
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.example.treehole.ui.theme.darkCyan
import com.example.treehole.ui.theme.postCyan

@Composable
fun BoxButton(
    onClick:()->Unit,
    text:String
){
    Button(
        onClick = onClick,
        modifier = Modifier
            .fillMaxWidth() // 按钮宽度填满
            .height(50.dp), // 按钮高度为 50dp
        colors =
        ButtonDefaults.buttonColors(
            containerColor = postCyan, // 设置按钮背景色为 Cyan
            contentColor = darkCyan // 设置按钮文字颜色为白色
        ),
        shape = RoundedCornerShape(4.dp)
    ) {
        Box(
            modifier = Modifier.fillMaxWidth(),
            contentAlignment = Alignment.CenterStart // 让文本居中
        ) {
            Text(
                text = text,
                fontSize = 20.sp,
                modifier = Modifier.align(Alignment.CenterStart) // 文本居中
            )
            Icon(
                imageVector = Icons.AutoMirrored.Filled.ArrowForward, // 使用箭头图标
                contentDescription = null,
                tint = darkCyan, // 设置箭头颜色为和文字一样
                modifier = Modifier
                    .size(24.dp)
                    .align(Alignment.CenterEnd) // 箭头图标位于右边
            )
        }
    }
}